<div id="sub-let-check-in-view">
  <div class="pageheader">
    <h2><i class="fa fa-home"></i>转租</h2>
    <div class="al-header-right">
      <button type="button" class="btn btn-warning" ng-click="$root.goBack('house-detail')">返回</button>
    </div>
  </div>
  <div class="page">
    <ng-form name="contractForm" class="form-horizontal">
      <div class="form-group">
        <h4 class="text-center">原合同信息</h4>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">原合同号</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{oriContract.uuid}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">公寓</label>
        <div class="col-sm-3">
          <select ng-model="contractNew.apartmentId" class="form-control"
                  ng-change="loadBuilding()"
                  disabled
                  ng-options="option.id as option.name for option in apartmentList"></select>
        </div>
        <label class="control-label col-sm-2">楼栋</label>
        <div class="col-sm-3">
          <select ng-model="contractNew.buildingId" ng-readonly="contractNew.created || contractNew.reletType==1"
                  class="form-control" ng-change="loadFloor()"
                  disabled
                  ng-options="option.id as option.name for option in buildingList"></select>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">楼层</label>
        <div class="col-sm-3">
          <select ng-model="contractNew.floor"
                  disabled
                  class="form-control" ng-change="loadHouse()"
                  ng-options="option.id as option.name for option in floorList"></select>
        </div>
        <label class="control-label col-sm-2">房间号</label>
        <div class="col-sm-3">
          <select ng-model="contractNew.houseId"
                  disabled
                  class="form-control" ng-change="pickHouse()"
                  ng-options="option.id as option.houseNo for option in houseList"></select>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">租房方式</label>
        <div class="col-sm-3">
          <select ng-model="contractNew.payWay"
                  disabled
                  class="form-control"
                  ng-options="option.value as option.name for option in payWayList"></select>
        </div>
        <label class="control-label col-sm-2">租期</label>
        <div class="col-sm-3">
          <select ng-model="contractNew.lease"
                  disabled
                  class="form-control"
                  ng-options="option.value as option.name for option in leaseList"></select>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">合同租金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{oriContract.rental}}</div>
        </div>
        <label class="control-label col-sm-2">合同押金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{oriContract.deposit}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">承租人姓名</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{oriContract.customerName}}</div>
        </div>
        <label class="control-label col-sm-2">承租人手机号</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{oriContract.customerPhone}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">转租日期<span class="attr-need">*</span></label>
        <div class="col-sm-3">
          <div class="input-group">
            <input class="form-control" type="text" uib-datepicker-popup="yyyy-MM-dd" readonly
                   ng-model="contractNew.leaseStart" is-open="enterStart"
                   close-text="关闭" current-text="今天" clear-text="清空" required
                   placeholder=""/>
            <span class="input-group-btn">
                <button type="button" class="btn btn-default" ng-click="enterStart=true">
                  <i class="glyphicon glyphicon-calendar"></i>
                </button>
              </span>
          </div>
        </div>
      </div>
    </ng-form>
    <ng-form name="personForm" class="form-horizontal form-validation">
      <div class="form-group">
        <h4 class="text-center">转租人信息</h4>
      </div>
      <div class="form-group">
        <div class="col-sm-6">
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">手机号<span class="attr-need">*</span></label>
            <div class="col-sm-6">
              <input type="text" class="form-control" ng-change="fetchUser()"
                     ng-readonly="contractNew.created" required
                     ng-pattern="$root.phoneVd"
                     ng-model="person.customerPhone">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">姓名<span class="attr-need">*</span></label>
            <div class="col-sm-6">
              <input type="text" class="form-control"
                     ng-readonly="contractNew.created" required
                     ng-model="person.customerName">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">身份证<span class="attr-need">*</span></label>
            <div class="col-sm-6">
              <input type="text" class="form-control" required
                     ng-pattern="$root.idCardVd"
                     ng-readonly="contractNew.created"
                     ng-model="person.customerCard">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">性别</label>
            <div class="col-sm-6">
              <nobr>
                <label class="ui-radio" ng-repeat="option in sexList">
                  <input name="status" ng-value="option.value" ng-disabled="contractNew.created"
                         type="radio" ng-model="person.sex">
                  <span>{{option.name}}</span>
                </label>
              </nobr>
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4 col-sm-offset-2">住客人数</label>
            <div class="col-sm-6">
              <div class="input-group">
                <input type="number" class="form-control" readonly ng-model="cotenant.length" maxlength="4">
                <span class="input-group-addon" ng-click="offlineCotenant()">{{contractData?'查看':'编辑'}}</span>
              </div>
            </div>
          </div>
        </div>
        <div class="col-sm-6">
          <div class="form-group" style="margin-bottom: 10px;">
            <label class="control-label col-sm-4 ">身份证正面</label>
            <div class="col-sm-6 id-card-container">
              <img ng-src="{{person.idcardFront?person.idcardFront:'images/id_card_front.jpg'}}"
                   ng-click="uploadIDCFront()">
              <input id="sublet-idcard-front" style="display: none" type="file">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-4">身份证反面</label>
            <div class="col-sm-6 id-card-container">
              <img ng-src="{{person.idcardBack?person.idcardBack:'images/id_card_back.jpg'}}"
                   ng-click="uploadIDCBack()">
              <input id="sublet-idcard-back" style="display: none" type="file">
            </div>
          </div>
        </div>
      </div>
    </ng-form>
    <ng-form class="form-horizontal" ng-if="subletInfo">
      <div class="form-group">
        <h4 class="text-center">退款信息</h4>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">应退押金(50%)</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.returnDeposit}}</div>
        </div>
        <label class="control-label col-sm-2">应退租金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.returnRental}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">剩余电费</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.returnPower}}</div>
        </div>
        <label class="control-label col-sm-2">剩余水费</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.returnWater}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">退款总计</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.returnTotal}}</div>
        </div>
        <label class="control-label col-sm-2">扣款总额</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{contractNew.sumConsumption}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">实际退款</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.returnTotal-contractNew.sumConsumption}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">开户行<span class="attr-need">*</span></label>
        <div class="col-sm-3">
          <input type="text" class="form-control" required
                 ng-readonly="contractNew.created"
                 ng-model="offLeaseInfo.bankName"
                 placeholder="填写开户行">
        </div>
        <label class="control-label col-sm-2">开户名<span class="attr-need">*</span></label>
        <div class="col-sm-3">
          <input type="text" class="form-control" required
                 ng-readonly="contractNew.created"
                 ng-model="offLeaseInfo.bankUser"
                 placeholder="填写开户名">
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">账号<span class="attr-need">*</span></label>
        <div class="col-sm-3">
          <input type="text" class="form-control" required
                 ng-readonly="contractNew.created"
                 ng-model="offLeaseInfo.bankAccount"
                 placeholder="填写账号">
        </div>
      </div>
      <div class="form-group" ng-repeat="item in consumptions">
        <label class="control-label col-sm-2 col-sm-offset-1">扣款费用{{$index+1}}</label>
        <div class="col-sm-3">
          <div class="input-group">
            <span class="input-group-addon">￥</span>
            <input type="number" class="form-control" readonly
                   ng-model="item.money">
          </div>
        </div>
        <div class="col-sm-4">
          <input type="text" class="form-control" readonly ng-model="item.description" placeholder="备注">
        </div>
        <div class="col-sm-2" ng-if="!contractData">
          <button class="btn btn-warning"
                  ng-click="removeConsumption(item)">移除
          </button>
        </div>
      </div>
      <div class="form-group" ng-if="!contractData">
        <h4 class="text-center">增加扣款</h4>
      </div>
      <div class="form-group" ng-if="!contractData">
        <label class="control-label col-sm-2 col-sm-offset-1">扣款费用</label>
        <div class="col-sm-3">
          <div class="input-group">
            <span class="input-group-addon">￥</span>
            <input type="number" class="form-control" ng-model="newConsumption.money" required>
          </div>
        </div>
        <div class="col-sm-4">
          <input type="text" class="form-control" ng-model="newConsumption.description" placeholder="备注">
        </div>
        <div class="col-sm-2">
          <button class="btn btn-primary"
                  ng-disabled="offLeaseOver || !newConsumption.money || !newConsumption.description"
                  ng-click="addConsumption()">添加
          </button>
        </div>
      </div>
      <div class="form-group">
        <h4 class="text-center">转租人付款信息</h4>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">应付租金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.newRental}}</div>
        </div>
        <label class="control-label col-sm-2">应付押金</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.newDeposit}}</div>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2 col-sm-offset-1">付款总计</label>
        <div class="col-sm-3">
          <div class="form-control info-text">{{subletInfo.newTotal}}</div>
        </div>
      </div>
      <div class="form-group">
        <div class="col-sm-4"></div>
        <div class="col-sm-4" style="text-align:center;">
          <button class="btn btn-primary" ng-if="!contractNew.created"
                  ng-disabled="contractNew.creating || contractForm.$invalid || personForm.$invalid"
                  ng-click="confirmSubLet()">确认转租
          </button>
          <button class="btn btn-warning" ng-if="contractNew.created"
                  ng-click="printContract()">合同打印
          </button>
        </div>
        <div class="col-sm-4"></div>
      </div>
    </ng-form>
    <contract-payment-form ng-if="contractData && billId"
                           bill-id="billId" contract-data="contractData"></contract-payment-form>
    <ng-form class="form-horizontal form-validation">
      <div class="form-group" ng-if="contractData.status==4 || contractData.status==8">
        <label class="control-label col-sm-2 col-sm-offset-1">备注</label>
        <div class="col-sm-8">
          <textarea class="form-control" ng-readonly="contractData.status==8"
                    placeholder="填写备注信息"
                    ng-model="checkIn.contractPicture"></textarea>
        </div>
      </div>
      <div class="form-group">
        <div class="col-sm-4"></div>
        <div class="col-sm-4 text-center">
          <button class="btn btn-success" ng-if="contractData.status==4"
                  ng-click="subletCheckIn()">转租入住
          </button>
        </div>
        <div class="col-sm-4"></div>
      </div>
    </ng-form>
  </div>
</div>